<template>
  <div id="app">
    <sofa-head></sofa-head>
    <sofa-nav></sofa-nav>
    <div>
      <dev></dev>
      <router-view></router-view>
    </div>
    <sofa-msg></sofa-msg>
    <img-list></img-list>
    <foot></foot>
  </div>  
  
</template>

<script>
import sofaHead from './header'
import foot from './footer'
import sofaMsg from './Msg'
import dev from './Developer'
import sofaNav from './Nav'
import imgList from './imglist'
export default {
  components:{
    sofaHead,foot,sofaMsg,dev,sofaNav,imgList
  },
  name: 'App'
}
</script>

<style>
*{
  margin: 0;padding: 0;
  list-style: none;
  text-decoration: none;
}
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
}
.container{
  width: 1170px;
  margin-left: auto;
  margin-right: auto;
  padding-left:  15px;
  padding-right:  15px;
  overflow: hidden;
}
</style>
